<template>
  <div class="form-group">
    <input
      :type="type"
      class="form-control"
      :placeholder="placeholder"
      :name="name"
      :value="value"
      :class="{'is-invalid':error}"
      :disabled="disabled"
      @input="$emit('input',$event.target.value)"
    >
    <div v-if="error" class="invalid-feedback">{{error}}</div>
    <small v-if="info" class="form-text text-muted">{{info}}</small>
  </div>
</template>

<script type="text/ecmascript-6">
export default {
  data() {
    return {};
  },
  components: {},
  props: {
    type: {
      type: String,
      default: "text"
    },
    placeholder: String,
    name: String,
    error: String,
    info: String,
    disabled: Boolean,
    value: String
  }
};
</script>

<style scoped lang="stylus">
</style>
